<div class="nav-tabs-custom">
    <ul class="nav nav-tabs">
        {foreach($configGroup as $gkey=>$gname)}
        <li class="{$siteList[$gkey]['active'] ? 'active' : ''}"><a href="#{$gkey}" data-toggle="tab" aria-expanded="false">{$gname}</a></li>
        {/foreach}
    </ul>
    <div class="tab-content">
        {foreach $siteList as $index=>$vo}
        <div class="tab-pane {$vo.active ? 'active' : ''}" id="{$index}">
            <form id="{$index}-form" class="edit-form form-horizontal nice-validator n-default n-bootstrap" role="form" data-toggle="validator" method="POST" action="{:url('configure/edit',['group'=>$index])}" novalidate="novalidate">
                <table class="table table-striped">
                    <thead>
                        <tr>
                            <th width="15%">变量标题</th>
                            <th width="70%">变量值</th>
                            <th width="15%">变量名</th>
                        </tr>
                    </thead>
                    <tbody>
                        {foreach $vo.list as $item}
                        <tr>
                            <td style='vertical-align:middle;'>{$item.title}</td>
                            <td>
                                <div class="row">
                                    <div class="col-sm-8 col-xs-12">
                                        {switch $item.type}
                                        {case string}
                                        <input {$item.extend} type="text" name="row[{$item.name}]" value="{$item.value}" class="form-control" data-rule="{$item.rule}" data-tip="{$item.tip}" />
                                        {/case}

                                        {case text}
                                        <textarea {$item.extend} name="row[{$item.name}]" class="form-control" data-rule="{$item.rule}" rows="5" data-tip="{$item.tip}">{$item.value}</textarea>
                                        {/case}

                                        {case editor}
                                        <textarea {$item.extend} name="row[{$item.name}]" id="editor-{$item.name}" class="form-control editor" data-rule="{$item.rule}" rows="5" data-tip="{$item.tip}">{$item.value}</textarea>
                                        {/case}

                                        {case datetime}
                                        <input {$item.extend} type="text" name="row[{$item.name}]" value="{$item.value}" class="form-control datetimepicker" data-tip="{$item.tip}" data-rule="{$item.rule}" />
                                        {/case}

                                        {case number}
                                        <input {$item.extend} type="number" name="row[{$item.name}]" value="{$item.value}" class="form-control" data-tip="{$item.tip}" data-rule="{$item.rule}" />
                                        {/case}

                                        {case checkbox}
                                        {foreach name="item.content" item="vo"}
                                        <label for="row[{$item.name}][]-{$key}"><input id="row[{$item.name}][]-{$key}" name="row[{$item.name}][]" type="checkbox" value="{$key}" data-tip="{$item.tip}" {in name="key" value="$item.value"}checked{/in} /> {$vo}</label>
                                        {/foreach}
                                        {/case}

                                        {case radio}
                                        {foreach name="item.content" item="vo"}
                                        <label for="row[{$item.name}]-{$key}"><input id="row[{$item.name}]-{$key}" name="row[{$item.name}]" type="radio" value="{$key}" data-tip="{$item.tip}" {in name="key" value="$item.value"}checked{/in} /> {$vo}</label>
                                        {/foreach}
                                        {/case}

                                        {case value="select" break="0"}{/case}
                                        {case value="selects"}
                                        <select {$item.extend} name="row[{$item.name}]{$item.type=='selects'?'[]':''}" class="form-control selectpicker" data-tip="{$item.tip}" {$item.type=='selects'?'multiple':''}>
                                            {foreach name="item.content" item="vo"}
                                            <option value="{$key}" {in name="key" value="$item.value"}selected{/in}>{$vo}</option>
                                            {/foreach}
                                        </select>
                                        {/case}
                                        {case value="image" break="0"}{/case}
                                        {case value="images"}
                                        <div class="form-inline">
                                            <input id="c-{$item.name}" class="form-control" size="50" name="row[{$item.name}]" type="text" value="{$item.value}" data-tip="{$item.tip}">
                                            <span><button type="button" id="plupload-{$item.name}" class="btn btn-danger plupload" data-input-id="c-{$item.name}" data-mimetype="image/*" data-multiple="{$item.type=='image'?'false':'true'}" data-preview-id="p-{$item.name}"><i class="fa fa-upload"></i> {:__('Upload')}</button></span>
                                            <span><button type="button" id="fachoose-{$item.name}" class="btn btn-primary fachoose" data-input-id="c-{$item.name}" data-mimetype="image/*" data-multiple="{$item.type=='image'?'false':'true'}"><i class="fa fa-list"></i> {:__('Choose')}</button></span>
                                            <ul class="row list-inline plupload-preview" id="p-{$item.name}"></ul>
                                        </div>
                                        {/case}

                                        {case value="file" break="0"}{/case}
                                        {case value="files"}
                                        <div class="form-inline">
                                            <input id="c-{$item.name}" class="form-control" size="50" name="row[{$item.name}]" type="text" value="{$item.value}" data-tip="{$item.tip}">
                                            <span><button type="button" id="plupload-{$item.name}" class="btn btn-danger plupload" data-input-id="c-{$item.name}" data-multiple="{$item.type=='file'?'false':'true'}"><i class="fa fa-upload"></i> {:__('Upload')}</button></span>
                                            <span><button type="button" id="fachoose-{$item.name}" class="btn btn-primary fachoose" data-input-id="c-{$item.name}" data-multiple="{$item.type=='file'?'false':'true'}"><i class="fa fa-list"></i> {:__('Choose')}</button></span>
                                        </div>
                                        {/case}
                                        {case bool}
                                        <label for="row[{$item.name}]-yes"><input id="row[{$item.name}]-yes" name="row[{$item.name}]" type="radio" value="1" {$item.value?'checked':''} data-tip="{$item.tip}" /> {:__('Yes')}</label> 
                                        <label for="row[{$item.name}]-no"><input id="row[{$item.name}]-no" name="row[{$item.name}]" type="radio" value="0" {$item.value?'':'checked'} data-tip="{$item.tip}" /> {:__('No')}</label>
                                        {/case}


                                        {/switch}
                                    </div>
                                    <div class="col-sm-4"></div>
                                </div>
                            </td>
                            <td style='vertical-align:middle;'>{php}echo "{\$site.". $item['name'] . "}";{/php}</td>
                        </tr>
                        {/foreach}
                    </tbody>
                    <tfoot>
                        <tr>
                            <td></td>
                            <td>
                                <button type="button" class="btn btn-success btn-embossed" onclick="saveConf('{$index}')">保存</button>
                                <button type="reset" class="btn btn-default btn-embossed">重置</button>
                            </td>
                            <td></td>
                        </tr>
                    </tfoot>
                </table>
            </form>
        </div>
        <!-- /.tab-pane -->
        {/foreach}
    </div>
    <!-- /.tab-content -->
    <script type='text/javascript'>

        /**
         * 保存配置
         * @param {type} group
         * @returns {undefined}
         */
        function saveConf(group) {
            var formData = $('#' + group + '-form').serializeArray();
            var data = {};
            data['group'] = group;
            $.each(formData, function () {
                data[this.name] = this.value;
            });
            stbAjax('{:url("configure/edit")}', data, function (result) {
                console.log(result);
                if (result.code > 0) {
                    //showLog('排序同步后台成功');
                    toast('恭喜', '更新成功', 800);
                } else {
                    toast('失败', data.msg, 2000);
                }
            });

        }

    </script>
</div>